Skip to content

fix: homepage badge duplication, contrast, mobile diagram legibility#16

Merged
enricopiovesan merged 1 commit into
mainfrom
fix/homepage-hero-cleanup
Jul 8, 2026
Merged

fix: homepage badge duplication, contrast, mobile diagram legibility#16
enricopiovesan merged 1 commit into
mainfrom
fix/homepage-hero-cleanup

Conversation

@enricopiovesan

Copy link
Copy Markdown
Collaborator

Summary

Follow-up fixes after a manual review flagged real bugs, not just taste issues — verified each with computed contrast ratios and measured DOM values, not eyeballing.

  • Duplicate badge rows: hero-meta (Rust + WASM · MCP protocol · AI-agent ready · Apache 2.0) sat directly above the trust bar (WebAssembly · JSON Schema contracts · MCP protocol · Wasmtime runtime · TOML-first config) — "MCP protocol" appeared in both, back to back. On mobile the trust bar alone wrapped to 3 rows. Merged into one deduped row, trust bar removed.
  • Contrast failures: --fg-subtle (#4a3d60 on #0c0817) measured ~2:1 — used for labels like "BUILT ON". Bumped to #8a7ba3 (~5.1:1). hero-meta-item text (rgba(255,255,255,0.3)) also measured ~2:1; switched to var(--fg-muted) (~5.9:1).
  • Mobile diagram bug in the S6 capability-flow animation: the SVG's viewBox scaled node labels down to ~5.6px and sub-labels to ~3.9px on a 375px viewport — unreadable. Below 640px it now scrolls horizontally at a fixed legible size instead of shrinking further.

Test plan

  • Desktop: single badge row under hero CTAs, no separate trust bar
  • Mobile (375px): badge row wraps to 2 lines legibly, no 3-row trust bar duplicate
  • Mobile: capability-flow diagram text is readable, scrolls horizontally

🤖 Generated with Claude Code

- Merge hero-meta and trust-bar into a single deduped badge row
  (both listed overlapping items like "MCP protocol"; on mobile the
  trust bar alone wrapped to 3 rows right after an equivalent hero row)
- Fix --fg-subtle contrast: #4a3d60 on #0c0817 measured ~2:1, well
  below WCAG AA; bumped to #8a7ba3 (~5.1:1)
- Fix hero-meta-item text: rgba(255,255,255,0.3) measured ~2:1 against
  the hero background; switched to var(--fg-muted) (~5.9:1)
- Fix CapabilityFlow SVG on mobile: viewBox scaling shrank node labels
  to ~5.6px and sub-labels to ~3.9px, unreadable. Below 640px the
  diagram now scrolls horizontally at a fixed legible size instead of
  shrinking text past legibility.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@enricopiovesan enricopiovesan merged commit 275d506 into main Jul 8, 2026
2 checks passed
@enricopiovesan enricopiovesan deleted the fix/homepage-hero-cleanup branch July 8, 2026 12:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant